<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui">

    <f:view contentType="text/html">
        <h:head>
            <title>Giant ERP</title> 
            <link rel="shortcut icon" href="#{request.contextPath}/resources/img/icons/Globe-32.png" />
            <link type="text/css" rel="stylesheet" href="#{request.contextPath}/resources/css/shadows.css" />
            <link type="text/css" rel="stylesheet" href="#{request.contextPath}/resources/css/normalize.css" />
            <link type="text/css" rel="stylesheet" href="#{request.contextPath}/resources/css/main.css" />
            <link type="text/css" rel="stylesheet" href="#{request.contextPath}/resources/css/erp.css" />

            <script type="text/javascript" src="#{request.contextPath}/resources/js/plugins.js"></script>
            <script type="text/javascript" src="#{request.contextPath}/resources/js/main.js"></script>
            <style type="text/css">

                .ui-fieldset-legend{
                    position: relative;
                    right: 400px;


                }
                .ui-datatable{
                    width: 1200px;

                }

                .ui-datatable-data{
                    font-size: small;
                    text-align: center;
                    width: fit-content;
                }
                .ui-fieldset{
                    width: 960px; 
                    background-color: #efefef;
                }
                .ui.tabmenu{
                    width: 1200px;
                }

                .ui-tabmenu-nav{
                    background: transparent;


                }
                .ui-tabmenu{
                    border: none;

                }
                .ui-menuitem-text{
                    color: #0079C1;
                }


                .ui-fieldset{
                    border: none;
                    margin: 10px;
                }
                .ui-selectonemenu{
                    height: 25px;

                }
                .ui-selectonemenu-label{
                    font-size: small;
                } 
                .ui-button{
                    width: fit-content;
                    height: 30px;
                    margin-top: 10px;

                }
                .pdf{
                    background-image: url(#{request.contextPath}/resources/img/icons/pdf.png) !important;
                    width: 30px;
                    height: 30px;

                }
                .excel{
                    background-image: url(#{request.contextPath}/resources/img/icons/excel.png) !important;
                    width: 30px;
                    height: 30px;

                }


                .filter{
                    background-image: url(#{request.contextPath}/resources/img/icons/filter.png) !important;
                    width: 30px;
                    height: 30px;

                }
                .edit{
                    background-image: url(#{request.contextPath}/resources/img/icons/edit.png) !important;
                    width: 30px;
                    height: 30px;

                }
                .cancel2{
                    background-image: url(#{request.contextPath}/resources/img/icons/cancel.png) !important;
                    width: 30px;
                    height: 30px;

                }
                .confirm{
                    background-image: url(#{request.contextPath}/resources/img/icons/confirm.png) !important;
                    width: 30px;
                    height: 30px;

                }



            </style>
        </h:head>

        <h:body>

            <p:layout fullPage="true">  



                <p:layoutUnit position="north" size="134" style="border:none; padding: 0; margin: 0; position: absolute">  


                    <div class="header">
                        <img alt="" src="#{request.contextPath}/resources/img/erp/Giant-Corp-Logo-BLUE.jpg" id="logo"/>
                        <div>
                            <ul>
                                <li>
                                    <a href="#"><img alt="" src="#{request.contextPath}/resources/img/erp/turkeyicon.png"/>
                                    </a>
                                </li>
                                <li>
                                    <a href="#{request.contextPath}/#{loginBean.path}/HomePage.xhtml"><img alt="" src="#{request.contextPath}/resources/img/erp/Homeicon.png"/>
                                    </a>
                                </li>
                                <li>
                                <h:form>
                                    <p:commandLink action="#{loginBean.changePanelVisibility()}" update=":formUser:pan">  
                                        <p:graphicImage url="/resources/img/erp/Usericon.png" >  
                                        </p:graphicImage> 
                                    </p:commandLink>

                                </h:form>
                                </li>
                                <li>
                                    <a href="#"><img alt="" src="#{request.contextPath}/resources/img/erp/Setting.png"/>
                                    </a>
                                </li>

                                <h:form id="formUser">
                                    <p:panel  id="pan" widgetVar="userPanel" visible="#{loginBean.visiblePanel}" style="margin-top: 18%; width: 130px; text-align: center; height: 63px; margin-left: 30%">  
                                        <p:commandLink id="profile" action="accountSettings" style="margin-right:20px;" ajax="false">  
                                            <h:outputText value="Profile" style="background-color: #CCCACC"/>  
                                        </p:commandLink> 
                                        <br/>
                                        <p:commandLink id="logout" action="#{loginBean.logout()}" style="margin-right:20px;" ajax="false">  
                                            <h:outputText value="Log Out" />  
                                        </p:commandLink>
                                    </p:panel>  
                                </h:form>
                            </ul>
                        </div>
                    </div>



                </p:layoutUnit>  

                <p:layoutUnit position="south" style="border: none; margin: 0; padding: 0">  


                    <div class="real-footer">
                        <div class="blue">
                            <ul>
                                <li><a>Contact</a></li>
                                <li><a>Help</a></li>
                            </ul>
                            <span>Copyright © 2013 Inc. All rights reserved.</span>
                        </div>
                    </div>

                </p:layoutUnit>  

                <p:layoutUnit position="center"  id="content" style="border: none; margin: 0">  
                    <h:form> 
                        <center>

                            <ui:insert name="body" />
                        </center>     
                    </h:form>   
                </p:layoutUnit>  

            </p:layout>      

        </h:body>

    </f:view>
</html>





